<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zn_cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="./css/bootstrap.css" />
<script type="text/javascript" src="./js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="./js/bootstrap.js"></script>
<script type="text/javascript">
	function deleteaccount(){
		//test.submit();
	}
	function selectAll(){
		var checklist = document.getElementsByName ("bookid");
		if(document.getElementById("bookidAll").checked){
		  	for(var i=0;i<checklist.length;i++){
		     	checklist[i].checked = true;
		  	 } 
		}else{
		  	for(var j=0;j<checklist.length;j++){
		    	checklist[j].checked = false;
		 	}
		}
	}
</script>
<title>用户信息</title>
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="col-md-2">
				<img alt="logo" src="./img/logo.jpg"></img>
			</div>
			<div class="col-md-7">
				<img src="./img/top1.jpg" /> <img src="./img/top2.jpg" /> <img
					src="./img/top3.jpg" /> <img src="./img/top4.jpg" />
			</div>
			<div class="col-md-3"></div>
		</div>
		<div class="row">
			<div class="col-md-12">
				<img src="./img/bn01.gif" />
			</div>
		</div>

		<div class="row"
			style="background-image: url('./img/top01.gif'); background-repeat: repeat-x; height: 40px">
			<div class="col-md-5">
				<img src="./img/icon1.gif" />所有用户：
			</div>
			
		</div>
		
		
			<div class="table-responsive">
			<form id="test" action="deluser.htm" method="post">
				<table id="mytable" class="table table-hover" style="text-align: center">
				<tr>
					<td>用户编号</td>
					<td>用户名称</td>
					<td>用户email</td>
					<td>用户年龄</td>
					<td>用户性别</td>
					<td>操作</td>
				</tr>
					<c:forEach var="item" varStatus="status" items="${userlist}">
						<tr>
							<td><input type="checkbox" name="bookid" value="${item.userId}"/>${item.userId}</td>
							<td>${item.loginname}</td>	
							<td>${item.email}</td>	
							<td>${item.age}</td>	
							<td>${item.sex}</td>				
							<td>
							<a href="./addrole.do?username=${item.userId}">修改用户角色</a>
							<a href="./deluser.htm?id=${item.userId}">删除</a>
							</td>
						</tr>
				</c:forEach>
				
					<tr>
						<td><input type="checkbox" onclick="selectAll()" id="bookidAll"/>全选</td>
						<td>
							<a href="#" style="float:left" onclick="deleteaccount()">删除选中项</a>
						</td>
					</tr>
					<tr>
						<button type="button" class="btn btn-link " data-toggle="modal"
						data-target="#newpublisher">添加新的用户</button>
					</tr>
				</table>
				</form>
			</div>
			
		
	<div class="modal fade" id="newpublisher" aria-labelledby="myModalLabel"
	aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">添加用户</h4>
			</div>
			<div class="modal-body"></div>
			<center>
				<form role="form" action="adduser.htm" method="get">
					<div class="form-group">
						用户名称： <input type="text" class="form-control" placeholder="输入用户名称"
							name="name" style="width: 300px;">
					</div>
					<div class="form-group">
						密码： <input type="text" class="form-control" placeholder="输入用户密码" name="password1"
							style="width: 300px;">
					</div>
					<div class="form-group">
						email: <input type="text" class="form-control" placeholder="输入email" name="email"
							style="width: 300px;">
					</div>
					<div class="form-group">
						sex: <input type="text" class="form-control" placeholder="输入sex" name="sex"
							style="width: 300px;">
					</div>
					<div class="form-group">
						age: <input type="text" class="form-control" placeholder="输入age" name="age"
							style="width: 300px;">
					</div>
					<button type="submit" class="btn btn-default">添加</button>
				</form>
			</center>
		</div>
	</div>
</div>
</body>
</html>